<template>
  <!-- 知识计算-知识融合 -->
  <div class="general-page">
    <el-form :inline="true" v-model="searchParams" class="page-search">
      <el-form-item label="实体名称">
        <el-input
          v-model="searchParams.entityName"
          placeholder="请输入内容"
          clearable
          size="small"
          style="width: 240px"
        ></el-input>
      </el-form-item>
      <el-form-item label="融合状态" class="status">
        <el-select
          v-model="searchParams.status"
          clearable
          size="small"
          placeholder="请选择融合状态"
          style="width: 240px"
        >
          <el-option label="未融合" :value="0"></el-option>
          <el-option label="已融合" :value="1"></el-option>
          <el-option label="已取消" :value="2"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          size="small"
          @click="searchData"
          style="width: 60px"
          >查询</el-button
        >
      </el-form-item>
    </el-form>
    <div class="page-table">
      <div class="table-toolbar">
        <div class="table-title">知识融合</div>
        <div class="table-opera">
          <el-popover trigger="click" v-model="toggleVisible">
            <el-select v-model="fusionRuleId" size="small">
              <el-option
                v-for="i in fusionRules"
                :key="i.id"
                :label="i.name"
                :value="i.id"
              ></el-option>
            </el-select>
            <div style="text-align: right; margin: 10px 0 0">
              <el-button size="small" @click="toggleVisible = false">
                取消
              </el-button>
              <el-button type="primary" size="small" @click="toggleRule">
                确认
              </el-button>
            </div>
            <el-button slot="reference" type="primary" size="small">
              当前融合规则：{{ fusionRuleName }}
              <el-tooltip content="点击切换">
                <i class="el-icon-warning"></i>
              </el-tooltip>
            </el-button>
          </el-popover>
          <el-button
            type="primary"
            size="small"
            @click="batchUnMerge"
            style="margin-left: 10px"
          >
            批量取消
          </el-button>
          <el-button type="primary" size="small" @click="batchFusion">
            批量融合
          </el-button>
        </div>
      </div>
      <el-table
        :data="tableList"
        class="map-manage"
        v-loading="loading"
        :header-cell-style="{ background: '#F3F4F8', color: '#000000' }"
        :cell-style="{ color: '#333333' }"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="50" align="center">
        </el-table-column>
        <el-table-column
          type="index"
          label="序号"
          width="50"
          align="center"
        ></el-table-column>
        <el-table-column label="实体名称" align="center" show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.entityName[0].value }}
          </template>
        </el-table-column>
        <el-table-column
          prop="ontologyName"
          label="所属类别"
          align="center"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          prop="toBeFusedNum"
          label="待融合数量"
          align="center"
          show-overflow-tooltip
        >
        </el-table-column>
        <el-table-column prop="status" label="状态" width="150" align="center">
          <template slot-scope="scope">
            <template v-if="scope.row.status === 0">
              <i class="little-circle-info"></i>
              未融合
            </template>
            <template v-else-if="scope.row.status === 1">
              <i class="little-circle-success"></i>
              已融合
            </template>
            <template v-else-if="scope.row.status === 2">
              <i class="little-circle-danger"></i>
              已取消
            </template>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          width="180"
          fixed="right"
          align="center"
          class="operation"
        >
          <template slot-scope="scope">
            <el-link
              v-if="scope.row.status === 0"
              class="handle-button"
              :underline="false"
              type="primary"
              @click.native.prevent="checkRow(scope.row)"
              >校核</el-link
            >
            <el-link
              v-if="scope.row.status === 0"
              :underline="false"
              class="handle-button"
              type="primary"
              @click.native.prevent="unMergeRow(scope.row)"
            >
              取消融合
            </el-link>
            <el-link
              v-if="scope.row.status !== 0"
              :underline="false"
              class="handle-button"
              type="primary"
              @click.native.prevent="showRow(scope.row)"
              >查看
            </el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="table-pagination" v-if="total">
        <el-pagination
          background
          layout="total, prev, pager, next,sizes, jumper"
          :total="total"
          :pager-count="5"
          :page-sizes="[10, 20, 30]"
          :current-page.sync="searchParams.pageNum"
          :page-size.sync="searchParams.pageSize"
          @current-change="handleCurrentChange"
          @size-change="handleSizeChange"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "KnowledgeFusion",
  components: {},
  data: () => {
    return {
      searchParams: {
        entityName: null, // 实体名称
        status: null, // 融合状态
        pageNum: 1, // 页码
        pageSize: 10, // 每页条数
      },
      tableList: [], // 数据列表
      total: 0, // 数据总条数
      loading: false,
      selections: [], // 选中项
      toggleVisible: false,
      fusionRules: [], // 融合规则
      fusionRuleId: null, // 当前融合规则
      fusionRuleName: "未选择", // 当前融合规则名称
    };
  },
  created() {
    this.getPageData();
    this.getFusionRules();
  },
  methods: {
    getPageData() {
      this.loading = true;
      this.$axios
        .get(this.$api.knowledgeComputation.knowledgeFusion.getFusionList, {
          params: this.searchParams,
        })
        .then((res) => {
          const { data, message, code } = res.data;
          if (code === 200) {
            this.tableList = data.list;
            this.tableList = this.tableList.map((item) => {
              item.entityName = JSON.parse(item.entityName);
              return item;
            });
            this.total = data.total;
          } else {
            this.$message.warning(message);
          }
        })
        .catch((err) => {
          console.log(err);
        })
        .finally(() => {
          this.loading = false;
        });
    },
    getFusionRules() {
      this.$axios
        .get(this.$api.knowledgeComputation.fusionRule.getFusionRuleList, {
          params: { pageNum: 1, pageSize: 100 },
        })
        .then((res) => {
          const { data, message, code } = res.data;
          if (code === 200) {
            if (Array.isArray(data.list) && data.list.length) {
              this.fusionRules = data.list;
              this.fusionRuleId = data.list[0].id;
              this.fusionRuleName = data.list[0].name;
            }
          } else {
            this.$message.warning(message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 切换规则
    toggleRule() {
      let ruleItem = this.fusionRules.find((i) => i.id === this.fusionRuleId);
      if (ruleItem) {
        this.fusionRuleName = ruleItem.name;
      }
      this.toggleVisible = false;
    },
    // 查询
    searchData() {
      this.getPageData();
    },
    // 选中数据
    handleSelectionChange(selection) {
      this.selections = selection;
    },
    // 批量取消
    batchUnMerge() {
      if (!this.selections.length) {
        return this.$message.warning("请先选择要操作的数据项");
      }
      const ids = this.selections.map((item) => item.id).join(",");
      this.$axios
        .get(this.$api.knowledgeComputation.knowledgeFusion.batchCancel, {
          params: { ids: ids },
        })
        .then((res) => {
          const { data, message, code } = res.data;
          if (code === 200) {
            this.$message.success(message);
            this.getPageData();
          } else {
            this.$message.warning(message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 批量融合
    batchFusion() {
      if (!this.selections.length) {
        return this.$message.warning("请先选择要操作的数据项");
      }
      const ids = this.selections.map((item) => item.id);
      this.$axios
        .get(this.$api.knowledgeComputation.knowledgeFusion.batchFusion, {
          params: { ids: ids.join(","), fusionRuleId: this.fusionRuleId },
        })
        .then((res) => {
          const { data, message, code } = res.data;
          if (code === 200) {
            this.$message.success(message);
            this.getPageData();
          } else {
            this.$message.warning(message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 校核
    checkRow(row) {
      this.$router.push({
        path: "/knowledgeComputation/knowledgeFusion/detail",
        query: {
          id: row.id,
        },
      });
    },
    // 取消融合
    unMergeRow(row) {
      this.$axios
        .get(this.$api.knowledgeComputation.knowledgeFusion.batchCancel, {
          params: { ids: [row.id].join(",") },
        })
        .then((res) => {
          const { data, message, code } = res.data;
          if (code === 200) {
            this.$message.success(message);
            this.getPageData();
          } else {
            this.$message.warning(message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    showRow(row) {
      this.$router.push({
        path: "/knowledgeComputation/knowledgeFusion/detail",
        query: {
          id: row.id,
        },
      });
    },
    handleCurrentChange() {
      this.getPageData();
    },
    handleSizeChange() {
      this.getPageData();
    },
  },
};
</script>
